<template>
  <div>
    <h3>姓名：{{ p.name }}</h3>
    <p>
      爱好：
      <span v-for="item in p.hobby" :key="item">{{ item }}</span>
    </p>
  </div>
</template>
<script>
export default {
  name: 'Item',
  // 我们需要通过props选项来接受父组件传递的props属性
  // props的类型可以是一个数组
  // 我们一旦接受到了props属性，则会把属性直接放在组件实例上，供我们直接使用
  props: ['p'],
  mounted() {
    console.log(this, 'item');
    console.log(this.p, 'item');
  },
};
</script>
<style></style>
